import "./index.scss";
export default defineComponent({
	props: [],
	emits: [],
	setup() {
		const deviceTypeTotal: any = inject("deviceTypeTotal");
		return () => {
			return (
				<div class="device flex justify-between">
					<div class="data-item flex items-center">
						<div class="icon icon-1"></div>
						<div class="data-info">
							<div class="data-title">机房空调</div>
							<div class="data-value">
								<span class="value">{deviceTypeTotal["SSIOT-DH-AIRCONDITION"]?.online}</span>
								<span class="split">/</span>
								<span class="sub-value">{deviceTypeTotal["SSIOT-DH-AIRCONDITION"]?.total}</span>
							</div>
						</div>
					</div>

					<div class="data-item flex items-center">
						<div class="icon icon-2"></div>
						<div class="data-info">
							<div class="data-title">发电机</div>
							<div class="data-value">
								<span class="value">{deviceTypeTotal["SSIOT-DH-ALTERNATOR"]?.online}</span>
								<span class="split">/</span>
								<span class="sub-value">{deviceTypeTotal["SSIOT-DH-ALTERNATOR"]?.total}</span>
							</div>
						</div>
					</div>

					<div class="data-item flex items-center">
						<div class="icon icon-3"></div>
						<div class="data-info">
							<div class="data-title">UPS</div>
							<div class="data-value">
								<span class="value">{deviceTypeTotal["SSIOT-DH-UPS"]?.online}</span>
								<span class="split">/</span>
								<span class="sub-value">{deviceTypeTotal["SSIOT-DH-UPS"]?.total}</span>
							</div>
						</div>
					</div>

					<div class="data-item flex items-center">
						<div class="icon icon-4"></div>
						<div class="data-info">
							<div class="data-title">消防烟感</div>
							<div class="data-value">
								<span class="value">{deviceTypeTotal["SSIOT-DH-SMOKE"]?.online}</span>
								<span class="split">/</span>
								<span class="sub-value">{deviceTypeTotal["SSIOT-DH-SMOKE"]?.total}</span>
							</div>
						</div>
					</div>
					<div class="data-item flex items-center">
						<div class="icon icon-5"></div>
						<div class="data-info">
							<div class="data-title">温湿度</div>
							<div class="data-value">
								<span class="value">{deviceTypeTotal["SSIOT-DH-THERMOMETER"]?.online}</span>
								<span class="split">/</span>
								<span class="sub-value">{deviceTypeTotal["SSIOT-DH-THERMOMETER"]?.total}</span>
							</div>
						</div>
					</div>
				</div>
			);
		};
	}
});
